<template>
  <div class="app-container">
    <el-form
      ref="elForm"
      :model="formData"
      :disabled="$route.query.isInfo"
      :rules="rules"
      size="medium"
      label-width="100px"
    >
      <h2 style="text-align: center">合同管理</h2>
      <h4 class="form-header h4">基本信息</h4>
      <el-row>
        <el-col :span="8">
          <el-form-item label="合同编号" prop="code">
            <el-input
            :disabled="true"
              v-model="formData.code"
              placeholder="提交后自动生成"
              clearable
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="项目名称" prop="name">
            <!-- <el-select v-model="formData.name" placeholder="请选择项目名称" clearable :style="{ width: '100%' }">
              <el-option v-for="dict in projectList" :key="dict.projectId" :label="dict.projectName"
                :value="dict.projectName" />
            </el-select>-->
            <el-input
              v-model="formData.name"
              placeholder="请输入项目名称"
              clearable
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="年度" prop="year">
            <el-date-picker
              format="yyyy"
              value-format="yyyy"
              v-model="formData.year"
              type="year"
              placeholder="选择年"
            ></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="项目负责人" prop="projectLeaderId">
            <UserDialog
              placeholder="请输入项目负责人"
              @change="changeUser"
              v-model="formData.projectLeaderId"
            ></UserDialog>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="项目联系人" prop="projectLinkId">
            <UserDialog
              placeholder="请输入项目联系人"
              @change="changeLinkName"
              v-model="formData.projectLinkId"
            ></UserDialog>
          </el-form-item>
          <!-- <el-form-item label="项目联系人" prop="projectLinkName">
            <el-input
              v-model="formData.projectLinkName"
              placeholder="请输入项目联系人"
              clearable
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item> -->
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="开始日期" prop="startDate">
            <el-date-picker
              v-model="formData.startDate"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              :style="{ width: '100%' }"
              placeholder="请选择开始日期"
              clearable
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="结束日期" prop="endDate">
            <el-date-picker
              v-model="formData.endDate"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              :style="{ width: '100%' }"
              placeholder="请选择结束日期"
              clearable
            ></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="委托方" prop="etrustingParty">
            <el-input
              v-model="formData.etrustingParty"
              placeholder="请输入委托方"
              clearable
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="委托方联系人" prop="linkName">
            <el-input
              v-model="formData.linkName"
              placeholder="请输入联系人"
              clearable
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="受托方" prop="trustees">
            <el-input
              v-model="formData.trustees"
              placeholder="请输入受托方"
              clearable
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="合同份数" prop="contractNum">
            <el-input
              v-model="formData.contractNum"
              placeholder="请输入合同份数"
              clearable
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="合同是否签署" prop="signState">
            <el-select
              v-model="formData.signState"
              placeholder
              clearable
              :style="{ width: '100%' }"
            >
              <el-option label="待签" :value="0" />
              <el-option label="已签" :value="1" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="备注" prop="remark">
            <el-select
              v-model="formData.remark"
              placeholder="请选择备注"
              clearable
              :style="{ width: '100%' }"
            >
              <el-option
                v-for="dict in dict.type.sys_contract_remark"
                :key="dict.value"
                :label="dict.label"
                :value="dict.label"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="收费标准栏" prop="feeStandardLabel">
            <el-select
              v-model="formData.feeStandardLabel"
              placeholder="请选择收费标准栏"
              clearable
              :style="{ width: '100%' }"
            >
              <el-option
                v-for="dict in dict.type.sys_feestandard_column"
                :key="dict.value"
                :label="dict.label"
                :value="dict.label"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="合同金额" prop="totalMoney">
            <div style="display: flex;">
              <el-select
                v-model="formData.moneyTypeValue"
                placeholder
                clearable
                :style="{ width: '100%' }"
                @change="selectMoneyType"
              >
                <el-option label="合同总金额" :value="0" />
                <el-option label="费率+估算金额" :value="1" />
              </el-select>
              <el-input
                type="number"
                v-model="formData.totalMoney"
                placeholder="合同总金额"
                :step="1"
                :style="{ width: '100%' }"
                controls-position="right"
                @input="paymentChange"
              >
                <template slot="append">元</template>
              </el-input>
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="项目总支出" prop="pay">
            <el-input
              type="number"
              v-model="formData.pay"
              placeholder="项目总支出"
              :step="1"
              :style="{ width: '100%' }"
              controls-position="right"
              @input="paymentChange"
            >
              <template slot="append">元</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="合同总收入" prop="receiveMoney">
            <el-input
              type="number"
              v-model="formData.receiveMoney"
              placeholder="合同总收入"
              :step="1"
              controls-position="right"
              :style="{ width: '100%' }"
              @input="paymentChange"
            >
              <template slot="append">元</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="到款比例" prop="payRate">
            <el-input
              v-model="formData.payRate"
              placeholder="到款比例"
              disabled
              :style="{ width: '100%' }"
            >
              <template slot="append">%</template>
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="项目进度" prop="projectRate">
            <el-input
              type="number"
              v-model="formData.projectRate"
              placeholder="项目进度"
              :step="1"
              :style="{ width: '100%' }"
              controls-position="right"
            >
              <template slot="append">%</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="项目进度内容" prop="projectRateContent">
            <el-input
              v-model="formData.projectRateContent"
              placeholder="具体内容"
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="8">
          <el-form-item label="联系方式" prop="linkPhone">
            <el-input v-model="formData.linkPhone" placeholder="请输入联系方式" clearable :style="{ width: '100%' }"></el-input>
          </el-form-item>
        </el-col>-->
      </el-row>
      <h4 class="form-header h4" style="margin-top: 20px">中标通知书</h4>
      <el-form-item label prop="noticeUrl">
        <FileUpload :isDelete="!$route.query.isInfo" v-model="formData.noticeUrl"></FileUpload>

        <!-- <FileUploadBase :isDelete="!$route.query.isInfo" v-model="formData.noticeUrl"  ></FileUploadBase> -->
      </el-form-item>
      <h4 class="form-header h4" style="margin-top: 20px">合同</h4>
      <el-form-item label prop="contractUrl">
        <FileUpload :isDelete="!$route.query.isInfo" v-model="formData.contractUrl"></FileUpload>
        <!-- <FileUploadBase :isDelete="!$route.query.isInfo" v-model="formData.contractUrl"></FileUploadBase> -->
      </el-form-item>
      <h4 class="form-header h4" style="margin-top: 20px">业绩证明</h4>
      <el-form-item label prop="performanceUrl">
        <!-- <FileUploadBase :isDelete="!$route.query.isInfo" v-model="formData.performanceUrl"></FileUploadBase> -->
        <FileUpload :isDelete="!$route.query.isInfo" v-model="formData.performanceUrl"></FileUpload>
      </el-form-item>
      <h4 class="form-header h4">
        工程合同
        <el-button type="primary" plain size="mini" @click="handleBosAdd">增行</el-button>
        <!-- <el-button type="danger" plain size="mini" @click="handleBosDele">删行</el-button> -->
      </h4>
      <el-table :data="formData.itemBos":border="true" style="width: 100%">
        <el-table-column type="expand">
          <template slot-scope="scopeExpand">
            <div class="p20 bgf9">
              <h4 class="form-header h4">
                支出明细
                <el-button type="primary" plain size="mini" @click="handleAdd(scopeExpand)">增行</el-button>
                <el-button type="danger" plain size="mini" @click="handleDele(scopeExpand)">删行</el-button>
              </h4>
              <el-table :data="scopeExpand.row.payItems" :border="true" style="width: 100%">
                <el-table-column label="类型" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.payItems.${scope.$index}.payTypeValue`"
                      :rules="rules.payTypeValue"
                    >
                      <el-select
                        v-model="scope.row.payTypeValue"
                        placeholder="请选择类型"
                        clearable
                        :style="{ width: '100%' }"
                      >
                        <el-option
                          v-for="dict in dict.type.project_contract_type"
                          :key="dict.value"
                          :label="dict.label"
                          :value="dict.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column label="金额" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.payItems.${scope.$index}.money`"
                      :rules="rules.money"
                    >
                      <el-input-number
                        v-model="scope.row.money"
                        @input="moneyChange($event, scope.$index,scopeExpand.$index)"
                        placeholder="请输入金额"
                        :step="1"
                        controls-position="right"
                      ></el-input-number>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="内容" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.payItems.${scope.$index}.content`"
                      :rules="rules.content"
                    >
                      <el-input v-model="scope.row.content" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="备注" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.payItems.${scope.$index}.remark`"
                      :rules="rules.remark"
                    >
                      <el-input v-model="scope.row.remark" placeholder="请输入备注"></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column min-width="200" label="附件" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.payItems.${scope.$index}.attachmentUrl`"
                      :rules="rules.attachmentUrl"
                    >
                      <FileUpload v-model="scope.row.attachmentUrl"></FileUpload>
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table>

              <h4 class="form-header h4">
                收入明细
                <el-button type="primary" plain size="mini" @click="handleAddIn(scopeExpand)">增行</el-button>
                <el-button type="danger" plain size="mini" @click="handleDeleIn(scopeExpand)">删行</el-button>
              </h4>
              <el-table :data="scopeExpand.row.receiveItems" :border="true" style="width: 100%">
                <el-table-column label="发票日期" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.invoiceTime`"
                      :rules="rules.invoiceTime"
                    >
                      <el-date-picker
                        v-model="scope.row.invoiceTime"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                        :style="{ width: '100%' }"
                        placeholder="请选择发票日期"
                        clearable
                      ></el-date-picker>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column label="发票金额(元)" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.invoiceMoney`"
                      :rules="rules.invoiceMoney"
                    >
                      <el-input-number
                        v-model="scope.row.invoiceMoney"
                        placeholder="请输入发票金额"
                        @input="remaining($event, scope.$index,scopeExpand.$index)"
                        :step="1"
                        controls-position="right"
                      ></el-input-number>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="发票编号" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.invoiceCode`"
                      :rules="rules.invoiceCode"
                    >
                      <el-input-number
                        v-model="scope.row.invoiceCode"
                        placeholder="请输入发票编号"
                        :step="1"
                        controls-position="right"
                      ></el-input-number>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="未到账提醒" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.isRemind`"
                      :rules="rules.isRemind"
                    >
                      <el-switch
                        v-model="scope.row.isRemind"
                        active-color="#13ce66"
                        inactive-color="#ff4949"
                        :active-value="1"
                        :inactive-value="0"
                      ></el-switch>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="支付年份" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.year`"
                      :rules="rules.year"
                    >
                      <el-date-picker
                        format="yyyy"
                        value-format="yyyy"
                        v-model="scope.row.year"
                        type="year"
                        placeholder="选择年"
                      ></el-date-picker>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="支付日期" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.payTime`"
                      :rules="rules.payTime"
                    >
                      <el-date-picker
                        v-model="scope.row.payTime"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                        :style="{ width: '100%' }"
                        placeholder="请选择发票日期"
                        clearable
                      ></el-date-picker>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="支付金额(元)" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.payMoney`"
                      :rules="rules.payMoney"
                    >
                      <el-input-number
                        v-model="scope.row.payMoney"
                        placeholder="请输入支付金额"
                        @input="remaining($event, scope.$index,scopeExpand.$index)"
                        :step="1"
                        controls-position="right"
                      ></el-input-number>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="剩余款项" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.leaveMoney`"
                      :rules="rules.leaveMoney"
                    >
                      <el-input-number
                        v-model="scope.row.leaveMoney"
                        placeholder="请输入剩余款项"
                        :disabled="true"
                        :step="1"
                        controls-position="right"
                      ></el-input-number>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="备份" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.copy`"
                      :rules="rules.copy"
                    >
                      <el-input v-model="scope.row.copy" placeholder="请输入备份"></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column min-width="200" label="附件" align="center">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="`itemBos.${scopeExpand.$index}.receiveItems.${scope.$index}.attachmentUrl`"
                      :rules="rules.attachmentUrl"
                    >
                      <FileUpload v-model="scope.row.attachmentUrl"></FileUpload>
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="工程名称" align="center">
          <template slot-scope="scope">
            <el-form-item
              label-width="0"
              :prop="`itemBos.${scope.$index}.itemName`"
              :rules="rules.itemName"
            >
              <el-input v-model="scope.row.itemName" placeholder="请输入工程名称"></el-input>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="开始时间" align="center">
          <template slot-scope="scope">
            <el-form-item
              label-width="0"
              :prop="`itemBos.${scope.$index}.startTime`"
              :rules="rules.startTime"
            >
              <el-date-picker
                value-format="yyyy-MM-dd"
                v-model="scope.row.startTime"
                type="date"
                placeholder="选择日期"
              ></el-date-picker>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="结束时间" align="center">
          <template slot-scope="scope">
            <el-form-item
              label-width="0"
              :prop="`itemBos.${scope.$index}.endTime`"
              :rules="rules.endTime"
            >
              <el-date-picker
                value-format="yyyy-MM-dd"
                v-model="scope.row.endTime"
                type="date"
                placeholder="选择日期"
              ></el-date-picker>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="项目负责人" align="center">
          <template slot-scope="scope">
            <el-form-item
              label-width="0"
              :prop="`itemBos.${scope.$index}.leaderId`"
              :rules="rules.leaderId"
            >
              <UserDialog
                placeholder="请输入项目负责人"
                @change="changeUserItem($event,scope)"
                v-model="scope.row.leaderId"
              ></UserDialog>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="实际发生金额" align="center">
            <template slot="header" slot-scope="scope" >
              <div>实际发生金额</div>
              <div>（{{ formData.totalMoney1 || 0.00}}）</div>
            </template>
            <template slot-scope="scope">
              <el-form-item label-width="0" :prop="`itemBos.${scope.$index}.totalMoney`" :rules="rules.totalMoney">
                <el-input-number @change="receiveMoneyChange($event, scope)" v-model="scope.row.totalMoney"
                  placeholder="请输入金额" :step="1" controls-position="right"></el-input-number>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="工程支出" align="center">
            <template slot="header" slot-scope="scope" >
              <div>工程支出</div>
              <div>（{{ formData.payMoney1|| 0.00}}）</div>
            </template>
            <template slot-scope="scope">
              <el-form-item label-width="0" :prop="`itemBos.${scope.$index}.payMoney`" :rules="rules.payMoney">
                <el-input disabled v-model="scope.row.payMoney"></el-input>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="工程收入" align="center">
            <template slot="header" slot-scope="scope" >
              <div>工程收入</div>
              <div>（{{ formData.receiveMoney1|| 0.00}}）</div>
            </template>
            <template slot-scope="scope">
              <el-form-item label-width="0" :prop="`itemBos.${scope.$index}.receiveMoney`" :rules="rules.receiveMoney">
                <el-input disabled v-model="scope.row.receiveMoney"></el-input>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="待结金额" align="center">
            <template slot="header" slot-scope="scope" >
              <div>待结金额</div>
              <div>（{{ formData.leaveMoney1|| 0.00}}）</div>
            </template>
            <template slot-scope="scope">
              <el-form-item label-width="0" :prop="`itemBos.${scope.$index}.leaveMoney`" :rules="rules.leaveMoney">
                <el-input disabled v-model="scope.row.leaveMoney" placeholder="请输入待结金额"
                  controls-position="right"></el-input>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="删除" align="center">
          <template slot-scope="scope">
            <el-button type="danger" plain size="mini" @click="handleDeleUser(scope.$index)">删行</el-button>
          </template>
        </el-table-column>
      </el-table>


      <el-col :span="24">
        <el-form-item label-width="0" style="text-align: center; margin-top: 30px">
          <el-button v-if="!$route.query.isInfo" type="primary" @click="submitForm">提交</el-button>
          <el-button :disabled="false" @click="resetForm">返回</el-button>
        </el-form-item>
      </el-col>
    </el-form>
  </div>
</template>

<script>
import { listSelect } from "@/api/business/project.js";
import {
  projectContractAdd,
  projectContractEdit,
  projectContractInfo
} from "@/api/business/projectContract.js";
export default {
  components: {},
  props: [],
  dicts: [
    "project_contract_type",
    "sys_feestandard_column",
    "sys_contract_remark"
  ],

  data() {
    return {
      projectList: [],
      formData: {
        code: undefined,
        name: undefined,
        startDate: null,
        endDate: null,
        projectLeaderId: undefined,
        totalMoney: 0,
        pay: 0,
        receiveMoney: 0,
        projectRate: undefined,
        payRate: undefined,
        // totalRate: 0,
        noticeUrl: "",
        contractUrl: "",
        performanceUrl: "",
        moneyTypeValue: "",
        moneyTypeLabel: "",
        signState: 0,
        projectLinkName: "",
        projectLinkId: "",
        trustees: "",
        itemBos: [
          {
            itemName: "",
            totalMoney: "",
            startTime: "",
            endTime: "",
            leaderId: "",
            receiveMoney: "",
            payMoney: "",
            leaveMoney: "",
            payItems: [
              {
                payTypeValue: '',
                payTypeLabel: '',
                content: '',
                money: 0
              }
            ],
            receiveItems: [
              {
                year: '',
                invoiceTime: '',
                invoiceMoney: '',
                invoiceCode: '',
                payTime: '',
                payMoney: 0,
                leaveMoney: 0,
                copy: '',
                attachmentUrl: '',
                isRemind: 0
              }
            ]
          }
        ]
      },
      rules: {
        payTypeValue: [
          {
            required: false,
            message: "请选择类型",
            trigger: "blur"
          }
        ],
        year: [
          {
            required: true,
            message: "请选择年份",
            trigger: "blur"
          }
        ],
        content: [
          {
            required: false,
            message: "请输入内容",
            trigger: "blur"
          }
        ],
        startTime: [
          {
            required: false,
            message: "不能为空",
            trigger: "blur"
          }
        ],

        endTime: [
          {
            required: false,
            message: "不能为空",
            trigger: "blur"
          }
        ],
        itemName: [
          {
            required: false,
            message: "不能为空",
            trigger: "blur"
          }
        ],
        totalMoney: [
          {
            required: false,
            message: "不能为空",
            trigger: "blur"
          }
        ],
        leaderId: [
          {
            required: false,
            message: "不能为空",
            trigger: "blur"
          }
        ],
        receiveMoney: [
          {
            required: false,
            message: "不能为空",
            trigger: "blur"
          }
        ],
        leaveMoney: [
          {
            required: false,
            message: "不能为空",
            trigger: "blur"
          }
        ],
        money: [
          {
            required: false,
            message: "请输入金额",
            trigger: "blur"
          }
        ],
        code: [
          {
            required: false,
            message: "提交后自动生成",
            trigger: "blur"
          }
        ],
        name: [
          {
            required: true,
            message: "请选择项目名称",
            trigger: "change"
          }
        ],
        startDate: [
          {
            required: true,
            message: "请选择开始日期",
            trigger: "change"
          }
        ],
        endDate: [
          {
            required: false,
            message: "请选择结束日期",
            trigger: "change"
          }
        ],
        projectLeaderId: [
          {
            required: true,
            message: "请输入项目负责人",
            trigger: "change"
          }
        ],
        sign: [
          {
            required: true,
            message: "请选择是否签署",
            trigger: "change"
          }
        ],
        totalMoney: [
          {
            required: false,
            message: "合同总金额",
            trigger: "blur"
          }
        ],
        pay: [
          {
            required: false,
            message: "项目总支出",
            trigger: "blur"
          }
        ],
        leaveMoney: [
          {
            required: false,
            message: "剩余款项",
            trigger: "blur"
          }
        ],
        projectRate: [
          {
            required: false,
            message: "项目进度",
            trigger: "blur"
          }
        ],
        payRate: [
          {
            required: false,
            message: "到款比例",
            trigger: ["change", "blur"]
          }
        ]
      }
    };
  },
  computed: {
    payRate: {
      get() {
        let num =
          (this.formData.totalMoney - this.formData.leaveMoney) /
          this.formData.totalMoney;
        this.formData.payRate =
          (Math.round(num * 10000) * 1000) / 1000 / 100 || 0;
        return (Math.round(num * 10000) * 1000) / 1000 / 100 || 0;
      }
    }
  },
  watch: {},

  created() {
    this.listSelect();
    if (this.$route.query.isEdit || this.$route.query.isInfo) {
      this.getprojectContractInfo();
    }
  },
  mounted() {},
  methods: {
    changeUser(e) {
      this.formData.projectLeaderName = e.nickName;
    },
    changeLinkName(e){
      console.log(e);
      this.formData.projectLinkName = e.nickName;
    },
    changeUserItem(e, item) {
      // console.log(e, item);
      this.formData.itemBos[item.$index].leaderName = e.nickName;
    },
    selectMoneyType(e) {
      this.formData.moneyTypeLabel = e == 0 ? "合同总金额" : "费率+估算金额";
    },
    handleBosAdd() {
      this.formData.itemBos.push({
        itemName: "",
        totalMoney: "",
        startTime: "",
        endTime: "",
        leaderId: "",
        receiveMoney: "",
        payMoney: "",
        receiveMoney: "",
        payItems: [
          {
            payTypeValue: '',
            payTypeLabel: '',
            content: '',
            money: 0
          }
        ],
        receiveItems: [
          {
            year: '',
            invoiceTime: '',
            invoiceMoney: '',
            invoiceCode: '',
            payTime: '',
            payMoney: 0,
            leaveMoney: 0,
            copy: '',
            attachmentUrl: '',
            isRemind: 0
          }
        ]
      });
    },
    // handleBosDele() {
    //   if (this.formData.itemBos.length == 1) return;
    //   this.formData.itemBos.pop();
    // },
    handleDeleUser(e) {
      if (this.formData.itemBos.length == 1) return;
      // this.formData.userList1.pop();
      this.formData.itemBos.splice(e, 1);

    },
    handleAdd(scope) {
      this.formData.itemBos[scope.$index].payItems.push({
        payTypeValue: '',
        payTypeLabel: '',
        content: '',
        money: 0
      });
    },
    handleDele(scope) {
      if (this.formData.itemBos[scope.$index].payItems.length == 1) return;
      this.formData.itemBos[scope.$index].payItems.pop();
    },
    moneyChange(e, i, bosIndex) {
      console.log(bosIndex);
      this.$nextTick(() => {
        this.formData.itemBos[bosIndex].payMoney =
          this.formData.itemBos[bosIndex].payItems.reduce((prev, item) => {
            if (item.money) {
              prev += Number(item.money);
            } else {
              prev += 0;
            }
            return prev;
          }, 0) || 0;
      });
    },
    remaining(e, i, bosIndex) {
      this.$nextTick(() => {
        this.formData.itemBos[bosIndex].receiveItems[i].leaveMoney =
          this.formData.itemBos[bosIndex].receiveItems[i].invoiceMoney -
          this.formData.itemBos[bosIndex].receiveItems[i].payMoney;

        this.formData.itemBos[bosIndex].receiveMoney =
          this.formData.itemBos[bosIndex].receiveItems.reduce((prev, item) => {
            if (item.payMoney) {
              prev += Number(item.payMoney);
            } else {
              prev += 0;
            }
            return prev;
          }, 0) || 0;

        this.formData.itemBos[bosIndex].leaveMoney =
          this.formData.itemBos[bosIndex].totalMoney -
          Number(this.formData.itemBos[bosIndex].receiveMoney);
      });
    },

    receiveMoneyChange(e, row) {
      // console.log(e, row.row);
      this.$nextTick(() => {
        this.formData.itemBos[row.$index].leaveMoney =
          e - Number(row.row.receiveMoney);
      });
    },
    handleAddIn(scope) {
      this.formData.itemBos[scope.$index].receiveItems.push({
        year: '',
        invoiceTime: '',
        invoiceMoney: '',
        invoiceCode: '',
        payTime: '',
        payMoney: 0,
        leaveMoney: 0,
        copy: '',
        attachmentUrl: '',
        isRemind: 0
      });
    },
    paymentChange() {
      //   this.formData.payRate =
      //     (Math.round(
      //       (this.formData.totalMoney - this.formData.leaveMoney) /
      //       this.formData.totalMoney *
      //       10000
      //     ) * 1000) / 1000 / 100 ||
      //     0;
    },
    handleDeleIn(scope) {
      if (this.formData.itemBos[scope.$index].receiveItems.length == 1) return;
      this.formData.itemBos[scope.$index].receiveItems.pop();
    },
    getprojectContractInfo() {
      projectContractInfo(this.$route.query.id).then(response => {
        console.log(response);
        this.formData = response.data;
        this.formData.moneyTypeValue = Number(this.formData.moneyTypeValue);
        this.formData.itemBos = JSON.parse(
          JSON.stringify(response.data.itemVos)
        );
      });
    },
    listSelect() {
      listSelect().then(response => {
        this.projectList = response.data;
        console.log(this.projectList);
      });
    },
    submitForm() {
      console.log(this.formData);
      this.$refs["elForm"].validate(valid => {
        if (valid) {
          let query = JSON.parse(JSON.stringify(this.formData));
          query.payRate = this.payRate;
          if (this.formData.projectContractId != undefined) {
            projectContractEdit(query).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.resetForm();
            });
          } else {
            projectContractAdd(query).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.resetForm();
            });
          }
        }
      });
    },
    resetForm() {
      // const obj = { path: "./projectContract" };
      // this.$tab.closeOpenPage(obj);
      this.$router.go(-1)
    }
  }
};
</script>
<style scoped>
.bgf9 {
  background: f9f9f9;
}
.p20 {
  padding: 20px;
}
</style>
